/**
 * 器灵ID
 */
let qilingId = null;
/**
 * 宝石ID
 */
let baoshiId = null;
/**
 * 当前修改的装备属性表格索引
 */
let editingId = null;
/**
 * 请求路径
 */
let requestUrl = null;
/**
 * 宝石镶嵌位置
 */
let baoshi_location = null;
/**
 * 装备属性
 */
let equipmentAttribute = {};
/**
 * 装备穿戴状态
 */
let wearStates = ["未装备", "装备中"];
/**
 * 装备附灵状态
 */
let fulingStates = ["未附灵", "已附灵"];
/**
 * 装备属性类型
 */
let attributeTypes = ["普通属性", "熔炼属性"];
/**
 * 宝石操作数组
 */
let operationArray = [
	"&emsp;&emsp;&emsp;取&ensp;下&emsp;&emsp;&emsp;",
	"&emsp;&emsp;&emsp;镶&ensp;嵌&emsp;&emsp;&emsp;"
];

function addHandler() {
	requestUrl = "/equipment/insert";

	$("#tejiId").combobox("setValue", 0); // 装备特技，默认0-无
	$("#texiaoId").combobox("setValue", 0); // 装备特效，默认0-无
	$("#score").numberspinner("setValue", 0); // 评分，默认0
	$("#forgeType").combobox("setValue", 2); // 打造类型：默认2-强化打造
	$("#wearStatus").combobox("setValue", 0); // 装备状态，默认0-未装备
	$("#fulingStatus").combobox("setValue", 0); // 附灵状态，默认0-未附灵
	$("#failTimes").numberspinner("setValue", 0); // 修理失败次数，默认0次

	$("#equipment_dialog").dialog("open");
}

function editHandler() {
	let rowData = $("#equipment_list").datagrid("getSelected");

	if (rowData) {
		requestUrl = "/equipment/updateById";

		$("#id").val(rowData.id);
		$("#forger").textbox("setValue", rowData.forger);
		$("#tejiId").combobox("setValue", rowData.tejiId);
		$("#roleId").combobox("setValue", rowData.roleId);
		$("#score").numberspinner("setValue", rowData.score);
		$("#texiaoId").combobox("setValue", rowData.texiaoId);
		$("#forgeType").combobox("setValue", rowData.forgeType);
		$("#categoryId").combobox("setValue", rowData.categoryId);
		$("#wearStatus").combobox("setValue", rowData.wearStatus);
		$("#durability").numberspinner("setValue", rowData.durability);
		$("#fulingStatus").combobox("setValue", rowData.fulingStatus);
		$("#failTimes").numberspinner("setValue", rowData.failTimes);

		$("#equipment_dialog").dialog("open");
	} else {
		alertMsg("请选择要修改的记录！", "warning");
	}
}

function attributeHandler() {
	let rowData = $("#equipment_list").datagrid("getSelected");

	if (rowData) {
		$("#property_list").datagrid("reload", {
			equipmentId: rowData.id
		});

		$("#property_dialog").dialog("open");
	} else {
		unselected();
	}
}

function inlayHandler() {
	let rowData = $("#equipment_list").datagrid("getSelected");

	if (rowData) {
		$("#baoshi_1").attr("src", "/images/add.png");
		$("#baoshi_2").attr("src", "/images/add.png");
		$("#qiling").attr("src", "/images/add.png");

		let roleId = rowData.roleId;
		let equipmentId = rowData.id;

		// 刷新装备列表
		$("#equipment_datalist").datalist("reload", {
			roleId: roleId,
			callback: function () {
				$("#equipment_datalist").datalist("selectRecord", equipmentId);
			}
		});
		// 刷新宝石列表
		$("#baoshi_list").datalist("reload", {
			roleId: roleId,
			equipmentId: equipmentId
		});

		$("#xiangqian_dialog").dialog("open");
	} else {
		unselected();
	}
}

function computeHandler() {
	let rowData = $("#equipment_list").datagrid("getSelected");

	if (rowData) {
		ajaxPost("/equipment/compute", {
			equipmentId: rowData.id
		}, function(resp) {
			showMsg(resp.message);

			$("#equipment_list").datagrid("reload");
		}, error);
	} else {
		unselected();
	}
}

function viewHandler() {
	viewEquipment("#equipment_list");
}

/**
 * 批量删除
 */
function deleteHandler() {
	let rows = $("#equipment_list").datagrid("getChecked");
	let count = rows.length;

	if (count > 0) {
		confirmAction("确认删除勾选的" + count + "条数据？", function() {
			let ids = [];

			for (let i = 0; i < rows.length; i++) {
				let id = rows[i].id;

				ids.push(id);
			}

			/**
			 * 批量删除
			 */
			ajaxPost("/equipment/deleteByIds", {
				ids: JSON.stringify(ids)
			}, function(resp) {
				showMsg(resp.message);

				$("#equipment_list").datagrid("reload");
				$("#equipment_list").datagrid("uncheckAll");
				$("#equipment_list").datagrid("unselectAll");
			}, error);
		});
	} else {
		alertMsg("请选择要删除的装备！", "warning");
	}
}

/**
 * 点击镶嵌宝石按钮{+}
 * @param this_ 宝石图片的DOM对象
 * @param left 宝石镶嵌对话框baoshis_dialog相对页面左边的距离
 */
function baoshiClick(this_, left) {
	baoshiId = null;

	let rowData = $("#equipment_datalist").datalist("getSelected");

	if(rowData) {
		$("#baoshi_list").datalist("reload", {
			roleId: rowData.roleId,
			equipmentId: rowData.id
		});

		baoshiId = this_.attr("ref");

		if (baoshiId) {
			ajaxGet("/baoshi/selectById", {
				id: baoshiId
			}, function (resp) {
				let data = resp.data;

				baoshiId = data.id;

				$("#baoshi_grade").html(data.grade);

				/**
				 * 查询宝石可镶嵌的装备等级
				 */
				ajaxGet("/equipment_baoshi_grade/selectEquipmentGrade", {
					baoshiGrade: data.grade
				}, function(resp) {
					let data = resp.data;

					$("#inlay_grade").html(data.grade);
				}, error);

				ajaxGet("/baoshi_category/selectById", {
					id: data.categoryId
				}, function(resp) {
					let baoshi_category = resp.data;

					$("#baoshi_name").html(baoshi_category.name);
					$("#baoshi_image").attr("src", baoshi_category.image);

					ajaxGet("/property/selectById", {
						id: baoshi_category.propertyId
					}, function(resp) {
						let data = resp.data;

						$("#baoshi_property").html(data.name);
					}, error);

					$("#baoshi_attribute").html(data.grade * baoshi_category.propertyValue);
					$("#baoshi_note").html(baoshi_category.note);

					/**
					 * 查询宝石可镶嵌的装备名称
					 */
					ajaxGet("/equipment_view_baoshi/selectInlayEquipments", {
						baoshiId: baoshi_category.id
					}, function(resp) {
						let names = resp.data;

						$("#inlay_equipment").html(names.join("、"));
					}, error);
				});

				$("#baoshi_inlay").linkbutton({
					text: operationArray[1 - data.inlayStatus]
				});

				$("#baoshi_detail").dialog("open");
			}, error);
		} else {
			$("#baoshi_dialog").dialog("move", {
				left: left
			}).dialog("open");
		}
	} else {
		alertMsg("请选择一件装备！");
	}
}

/**
 * 点击镶嵌器灵按钮{+}
 * @param this_ 器灵图片的DOM对象
 */
function qilingClick(this_) {
	qilingId = this_.attr("ref");

	if (qilingId) {
		ajaxGet("/qiling/selectById", {
			id: qilingId
		}, function (resp) {
			let rowData = resp.data;

			$("#qiling_taozhuang").hide();
			$("#qiling_taozhuang_name").empty();
			$("#qiling_taozhuang_xiaoguo").empty();

			$("#qiling_attribute").hide().empty();
			$("#qiling_forger").html(rowData.forger);
			$("#qiling_score").html(rowData.score);

			ajaxGet("/qiling_category/selectById", {
				id: rowData.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#qiling_image").attr("src", data.image);
				$("#qiling_name").html(data.name);

				if(rowData.taozhuangId !== 1) {
					$("#qiling_taozhuang").show();

					ajaxGet("/qiling_taozhuang/selectById", {
						id: rowData.taozhuangId
					}, function(resp) {
						let data = resp.data;

						$("#qiling_taozhuang_name").html(data.name);
						$("#qiling_taozhuang_xiaoguo").html(data.note);
					}, error);
				}

				$("#qiling_grade").html(data.grade);
				$("#qiling_note").html(data.note);

				// 器灵属性
				ajaxGet("/qiling_attribute/selectAttributes", {
					qilingId: rowData.id
				}, function(resp) {
					let data = resp.data;

					if (data.length > 0) {
						let html = "";

						for (let i = 0; i < data.length; i++) {
							let attribute = data[i];

							html += "<span>&emsp;" + attribute.propertyName + "&ensp;+"
								+ attribute.propertyValue + "</span>";

							if (i !== data.length) {
								html += "<br/>";
							}
						}

						$("#qiling_attribute").append(html).show();
					}
				}, error);

				$("#qiling_inlay").linkbutton({
					text: operationArray[1 - rowData.inlayStatus]
				});

				$("#qiling_detail").dialog("open");
			}, error);
		}, error);
	}
}

/**
 * 加载装备已镶嵌的宝石
 * @param equipmentId 装备ID
 */
function loadInlayBaoshi(equipmentId) {
	$("#baoshi_1").attr("src", "/images/add.png").attr("ref", "");
	$("#baoshi_2").attr("src", "/images/add.png").attr("ref", "");

	ajaxGet("/baoshi/selectDetails", {
		equipmentId: equipmentId
	}, function(resp) {
		let list = resp.data;

		if(list && list.length > 0) {
			for(let i = 0; i < list.length; i++) {
				let data = list[i];

				$("#baoshi_" + data.location).attr({
					"ref": data.id,
					"src": data.image,
					"title": data.name
				});
			}
		}
	}, error);
}

/**
 * 装备预览
 */
function viewEquipment(selector) {
	let rowData = $(selector).datagrid("getSelected");

	if (rowData) {
		$("#base_attribute").empty(); // 清空装备的基础属性
		$("#green_attribute").empty().hide(); // 清空并隐藏装备的附加属性

		$("#rl-attribute").hide(); // 隐藏装备的熔炼属性
		$("#rl-base_attribute").empty(); // 清空装备的熔炼基础属性
		$("#rl-green_attribute").empty(); // 清空装备的熔炼附加属性

		$("#equipment_qiling").hide(); // 隐藏装备器灵
		$("#equipment_qiling_attribute").empty(); // 清空器灵属性
		$("#equipment_qiling_taozhuang").hide().empty(); // 隐藏器灵套装

		$("#equipment_baoshi").hide(); // 隐藏装备宝石
		$("#equipment_baoshi_attribute").empty(); // 清空宝石属性

		/**
		 * 装备信息
		 */
		ajaxGet("/equipment_category/selectById", {
			id: rowData.categoryId
		}, function(resp) {
			let data = resp.data;

			$("#equipment_image").attr("src", data.image);
			$("#equipment_name").html(data.name);
			$("#equipment_grade").html(data.grade);

			ajaxGet("/equipment_type/selectById", {
				id: data.type
			}, function(resp) {
				let data = resp.data;

				$("#equipment_type").html(data.name);
			}, error);

			$("#equipment_note").html(data.note);
		}, error);

		/**
		 * 查询装备属性列表
		 */
		ajaxGet("/equipment_attribute/selectAttributes", {
			equipmentId: rowData.id
		}, function(resp) {
			let data = resp.data;

			/*
			 * 命名规则attr + propertyType + attributeType
			 */
			/**
			 * 普通基础属性
			 * @type {string}
			 */
			let attr10 = "";
			/**
			 * 熔炼基础属性
			 * @type {string}
			 */
			let attr11 = "";
			/**
			 * 普通附加属性
			 * @type {string}
			 */
			let attr20 = "";
			/**
			 * 熔炼附加属性
			 * @type {string}
			 */
			let attr21 = "";

			for (let i = 0; i < data.length; i++) {
				let attribute = data[i];
				let html = "&emsp;<span>" + data[i].propertyName + "</span>&ensp;"
					+ (attribute.propertyValue > 0 ? "+" : "") + data[i].propertyValue;

				// 基础属性
				if (attribute.propertyType === 1) {
					// 装备普通属性
					if (attribute.attributeType === 0) {
						attr10 += html;
						attr10 += "<br/>";
					} else if (attribute.attributeType === 1) { // 装备熔炼属性
						$("#rl-attribute").show();

						attr11 += html;
						attr11 += "<br/>";
					}
				} else if (attribute.propertyType === 2) { // 附加属性
					// 装备普通属性
					if (attribute.attributeType === 0) {
						attr20 += html;
					} else if (attribute.attributeType === 1) { // 装备熔炼属性
						$("#rl-attribute").show();

						attr21 += html;
					}
				}
			}

			$("#base_attribute").append(attr10);
			$("#green_attribute").append(attr20).show();
			$("#rl-base_attribute").append(attr11);
			$("#rl-green_attribute").append(attr21)
		}, error);

		/**
		 * 装备特效
		 */
		if(rowData.texiaoId > 0) {
			ajaxGet("/equipment_texiao/selectById", {
				id: rowData.texiaoId
			}, function(resp) {
				let data = resp.data;

				$("#texiao").html(data.name).attr({
					title: data.note
				});
				$("#equipment_texiao").show();
			}, error);
		} else {
			$("#equipment_texiao").hide();
		}

		/**
		 * 装备特技
		 */
		if(rowData.tejiId > 0) {
			ajaxGet("/equipment_teji/selectById", {
				id: rowData.tejiId
			}, function(resp) {
				let data = resp.data;

				$("#teji").html(data.name).attr({
					title: data.note
				});
				$("#equipment_teji").show();
			}, error);
		} else {
			$("#equipment_teji").hide();
		}

		/**
		 * 打造者
		 */
		$("#equipment_forger").html(rowData.forger);

		/**
		 * 查询装备的打造类型
		 */
		ajaxGet("/forge_type/selectByParentId", {
			id: rowData.forgeType
		}, function(resp) {
			let data = resp.data;

			$("#forger_type").html(data.name);
			$("#icon-class").removeClass("bind");
			$("#icon-class").removeClass("zhenpin");
			$("#icon-class").addClass(data.iconClass);
		}, error);

		/**
		 * 装备耐久
		 */
		let durability = rowData.durability;

		if (rowData.failTimes > 0) {
			durability += "&ensp;修理失败&ensp;" + rowData.failTimes + "次";
		}

		$("#equipment_durability").html(durability);

		/**
		 * 获取装备总评分
		 */
		ajaxGet("/equipment/getTotalScore", {
			equipmentId: rowData.id
		}, function(resp) {
			let score = resp.data;

			$("#equipment_score").html(score);
		}, error);

		/**
		 * 附灵状态
		 */
		if (rowData.fulingStatus === 1) {
			let fulingStatus = fulingStates[rowData.fulingStatus];

			$("#fuling_status").html(fulingStatus).show();
		} else {
			$("#fuling_status").empty().hide();
		}

		/**
		 * 查询装备镶嵌的器灵
		 */
		ajaxGet("/qiling/selectByEquipmentId", {
			equipmentId: rowData.id
		}, function(resp) {
			let data = resp.data;

			// 装备镶嵌了器灵才查询器灵属性和器灵套装
			if (data) {
				$("#equipment_qiling").show();

				/**
				 * 查询器灵属性
				 */
				ajaxGet("/qiling_attribute/selectAttributes", {
					qilingId: data.id
				}, function(resp) {
					let list = resp.data;

					if (list.length > 0) {
						let content = "";

						for (let i = 0; i < list.length; i++) {
							let data = list[i];

							content += "<span>&emsp;" + data.propertyName + "&ensp;+" + data.propertyValue + "</span><br/>";
						}

						$("#equipment_qiling_attribute").append(content);
					}
				}, error);

				/**
				 * 查询器灵套装
				 */
				let taozhuangId = data.taozhuangId;

				if(taozhuangId && taozhuangId !== 1) {
					$("#equipment_qiling_taozhuang").show();

					ajaxGet("/qiling_taozhuang/selectById", {
						id: taozhuangId
					}, function(resp) {
						let data = resp.data;

						$("#equipment_qiling_taozhuang").html(data.name);
					}, error);
				}
			}
		}, error);

		/**
		 * 查询装备镶嵌的宝石
		 */
		ajaxGet("/baoshi/selectByEquipmentId", {
			equipmentId: rowData.id
		}, function(resp) {
			let list = resp.data;

			// 镶嵌了宝石
			if(list.length > 0) {
				let content = "";

				for(let i= 0; i< list.length; i++) {
					let baoshi = list[i];

					content += "<span>&emsp;";
					content += 	baoshi.grade + "级" + baoshi.name + "&ensp;";
					content += 	baoshi.propertyName + "+" + (baoshi.grade * baoshi.propertyValue);
					content += "</span><br/>";
				}

				$("#equipment_baoshi").show();
				$("#equipment_baoshi_attribute").append(content);
			}
		}, error);

		$("#equipment_detail").dialog("open");
	} else {
		alertMsg("请选择要查看的装备！", "warning");
	}
}

$(document).ready(function() {

	/**
	 * 装备类型
	 */
	$("#categoryId").combobox({
		url: "/equipment_category/selectAll",
        valueField: "id",
		textField: "name",
		width: 120,
		required: true,
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='20' src='" + row.image + "' />&nbsp;" + row.name;
		},
		onSelect: function (row) {
			if (row.grade < 90) {
				$("#fulingStatus").combobox("setValue", 0);
			}
		}
	});

	/**
	 * 装备评分
	 */
	$("#score").numberspinner({
		min: 0,
		width: 120,
		required: false
	});

	/**
	 * 打造者
	 */
	$("#forger").textbox({
		width: 120,
        required: true
    });

	/**
	 * 打造类型
	 */
	$("#forgeType").combobox({
		url: "/forge_type/selectAll",
		valueField: "id",
		textField: "name",
		width: 120,
		required: true,
		panelHeight: "auto"
	});

	/**
	 * 特效
	 */
	$("#texiaoId").combobox({
		url: "/equipment_texiao/selectAll",
        valueField: "id",
		textField: "name",
		width: 120,
		required: true,
		panelHeight: "auto"
	});

	/**
	 * 特技
	 */
	$("#tejiId").combobox({
		url: "/equipment_teji/selectAll",
        valueField: "id",
		textField: "name",
		width: 120,
		required: true,
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='20' src='" + row.image + "' />&nbsp;" + row.name;
		}
	});

	/**
	 * 穿戴状态
	 */
	fetchSelect("#wearStatus", wearStates, {
		width: 120,
		required: true
	});

	/**
	 * 附灵状态
	 */
	fetchSelect("#fulingStatus", fulingStates, {
		width: 120,
		required: true
	});

	/**
	 * 角色
	 */
	$("#roleId").combobox({
		url: "/role_account/selectAll",
		valueField: "id",
		textField: "name",
		panelHeight: "auto",
		width: 120,
		required: true,
		panelWidth: 150,
		formatter: function(row) {
			ajaxGet("/role_category/selectById", {
				id: row.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#role_" + row.id).attr({
					"title": data.name,
					"src": data.image,
					"alt": data.name
				});
			}, error);

			ajaxGet("/school/selectById", {
				id: row.schoolId
			}, function(resp) {
				let data = resp.data;

				$("#school_" + row.id).attr({
					"title": data.name,
					"src": data.image,
					"alt": data.name
				});
			}, error);

			return "<img height='20' id='role_" + row.id + "' />&ensp;" + row.name
				+ "&ensp;<img height='20' id='school_" + row.id + "' />";
		}
	});

	/**
	 * 耐久度
	 */
	$("#durability").numberspinner({
		min: 0,
		width: 120,
		required: true
	});

	/**
	 * 修理失败次数
	 */
	$("#failTimes").numberspinner({
		min: 0,
		max: 3,
		width: 120,
		suffix: "次",
		required: true
	});

	/**
	 * 装备信息对话框
	 */
	$("#equipment_dialog").dialog({
		title: "装备信息",
		width: 640,
		buttons: [{
			iconCls: "icon-save",
			text: "保存",
			handler: function() {
				let selector = "#equipment_form";

				checkForm(selector, function () {
					let data = $(selector).serialize();

					ajaxPost(requestUrl, data, function(resp) {
						showMsg(resp.message);

						$(selector).form("clear");
						$("#equipment_dialog").dialog("close");
						$("#equipment_list").datagrid("reload");
					}, error);
				});
			}
		}, {
			iconCls: "icon-cancel",
			text: "取消",
			handler: function() {
				$("#equipment_dialog").dialog("close");
				$("#equipment_form").form("clear");
			}
		}]
	});

	/******************************************************************************************************/

	/**
	 * 装备属性列表
	 */
	$("#property_list").datagrid({
		url: "/equipment_attribute/selectByPage",
		title: "装备属性列表",
		width: 500,
		height: 300,
		pagination: true,
		pageSize: 5,
		pageList: [5, 10, 20, 50],
		/**
		 * 结束行内编辑事件
		 * @param rowIndex 行号
		 * @param rowData 行数据
		 * @param changes 变更的行数据
		 */
		onAfterEdit: function (rowIndex, rowData, changes) {
			equipmentAttribute = {
				id: rowData.id,
				equipmentId: rowData.equipmentId,
				type: changes.type ? changes.type : rowData.type,
				propertyId: changes.propertyId ? changes.propertyId : rowData.propertyId,
				propertyValue: changes.propertyValue ? changes.propertyValue : rowData.propertyValue
			};
		},
		toolbar: [{
			iconCls: "icon-add",
			text: "添加",
			handler: function() {
				let row = $("#equipment_list").datagrid("getSelected");

				if(row) {
					let datagrid = $("#property_list");

					datagrid.datagrid("appendRow",{
						id: "",
						type: 0,
						propertyId: "",
						propertyValue: 0,
						equipmentId: row.id
					});

					// 得到表格数据总行数
					let total = datagrid.datagrid("getRows").length;

					editingId = total - 1;
					requestUrl = "/equipment_attribute/insert";

					datagrid.datagrid("beginEdit", editingId);
				} else {
					unselected("请选择一件装备~");
				}
			}
		}, "-", {
			iconCls: "icon-edit",
			text: "修改",
			handler: function() {
				let datagrid = $("#property_list");

				if (editingId != null) {
					confirmAction("上一次修改的数据未保存，是否现在保存？", function () {
						datagrid.datagrid("endEdit", editingId);
					}, function () {
						datagrid.datagrid("selectRow", editingId);
					});
				} else {
					let row = datagrid.datagrid("getSelected");

					if (row) {
						// 获取行索引，这个索引从0开始
						let rowIndex = datagrid.datagrid("getRowIndex", row);

						editingId = rowIndex;
						requestUrl = "/equipment_attribute/updateById";

						datagrid.datagrid("beginEdit", rowIndex);

						let $editor_ = datagrid.datagrid("getEditor", {
							index: rowIndex,
							field: "propertyId"
						});

						let rowData = $("#equipment_list").datagrid("getSelected");

						$($editor_.target).combobox("reload", {
							type: rowData.type
						});
					} else {
						unselected();
					}
				}
			}
		}, "-", {
			iconCls: "icon-save",
			text: "保存",
			handler: function() {
				if (editingId != null) {
					// 只有结束编辑才能获取到最新的值
					$("#property_list").datagrid("endEdit", editingId);

					ajaxPost(requestUrl, equipmentAttribute, function(resp) {
						showMsg(resp.message);

						$("#property_list").datagrid("reload");
					}, error);

					editingId = null;
				}
			}
		}, "-", {
			iconCls: "icon-cancel",
			text: "取消",
			handler: function() {
				if (editingId != null) {
					$("#property_list").datagrid("cancelEdit", editingId);

					editingId = null;
				}
			}
		}, "-", {
			iconCls: "icon-delete",
			text: "删除",
			handler: function() {
				let rowData = $("#property_list").datagrid("getSelected");

				if(rowData) {
					$.messager.confirm("提示", "是否确认删除？", function(bool) {
						if (bool) {
							ajaxPost("/equipment_attribute/deleteById", {
								id: rowData.id
							}, function(resp) {
								showMsg(resp.message);

								$("#property_list").datagrid("reload");
							}, error);
						}
					});
				} else {
					alertMsg("请选择一条记录！", "warning");
				}
			}
		}],
		columns: [[
			{field: "id", hidden: true},
			{field: "equipmentId", hidden: true},
			{field: "type", title: "属性类型", align: "center", width: 150
				, editor: {
					type: "combobox",
					options: {
						panelHeight: "auto",
						data: getJsonData(attributeTypes),
						onSelect: function () {

						}
					}
				}
				, formatter: function(value) {
					return "<div>" + attributeTypes[value] + "</div>";
				}
			},
			{field: "propertyId", title: "属性", align: "center", width: 150
				, editor: {
					type: "combobox",
					options: {
						url: "/equipment_view_attribute/selectProperty",
						valueField: "id",
						textField: "name",
						panelHeight: "auto"
					}
				}
				, formatter: function(value, rowData, rowIndex) {
					if (value) {
						ajaxGet("/property/selectById", {
							id: value
						}, function (resp) {
							let data = resp.data;

							$("#property_" + rowIndex).html(data.name);
						}, error);

						return "<div class='blue' id='property_" + rowIndex + "'></div>";
					}
				}
			},
			{field: "propertyValue", title: "属性值", align: "center", width: 150, editor: "numberspinner"}
		]]
	});

	// 装备属性对话框
	$("#property_dialog").dialog({
		title: " "
	});

	/******************************************************************************************************/

	$("#equipment_detail > .splitter").textbox({
		width: 220
	});

	// 装备详情对话框
	$("#equipment_detail").dialog({
		title: " ",
		width: 240
	});

	/******************************************************************************************************/

	// 镶嵌对话框左边的装备列表
	$("#equipment_datalist").datalist({
		url: "/equipment/selectByRoleId",
		idField: "id",
		valueField: "id",
		textField: "id",
		width: 180,
		height: 300,
		textFormatter: function(value, rowData) {
			ajaxGet("/equipment_category/selectById", {
				id: rowData.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#equip_" +  rowData.id).attr("src", data.image);
				$("#equipname_" +  rowData.id).html(data.name);
			}, error);

			ajaxGet("/baoshi/selectDetails", {
				equipmentId: rowData.id
			}, function(resp) {
				let list = resp.data;

				if(list && list.length > 0) {
					for(let i = 0; i < list.length; i ++) {
						let data = list[i];

						$("#baoshi" +  data.location + "_" + rowData.id).attr("src", data.image);
					}
				}
			}, error);

			ajaxGet("/qiling/selectImage", {
				equipmentId: rowData.id
			}, function(resp) {
				if (resp && resp.data) {
					let data = resp.data;

					$("#ql_" + rowData.id).attr("src", data.image);
				}
			}, function() {
				$("#ql_" +  rowData.id).attr("src", "");
			});

			let html = "";

			html += "<table>";
			html += 	"<tr>";
			html += 		"<td rowspan=2>";
			html += 			"<div style='border:1px black solid;width:52px;height:52px;'>";
			html +=					"<img width='50' id='equip_" +  rowData.id + "' />";
			html +=				"<div>";
			html += 		"</td>";

			html += 		"<td>";
			html += 			"<div id='equipname_" + rowData.id + "'></div>";
			html += 		"</td>";
			html += 	"</tr>";

			html += 	"<tr>";
			html += 		"<td>";
			html += 			"<div>";
			html +=					"<img width='22' id='baoshi1_" +  rowData.id + "' />";
			html +=					"<img width='22' id='baoshi2_" +  rowData.id + "' />";
			html +=					"<img width='22' id='ql_" +  rowData.id + "' />";
			html += 			"</div>";
			html += 		"</td>";
			html += 	"</tr>";
			html += "</table>";

			return html;
		},
		onSelect: function(rowIndex, rowData) {
			if (rowData) {
				$("#baoshi_1").attr("src", "/images/add.png");
				$("#baoshi_2").attr("src", "/images/add.png");
				$("#qiling").attr({
					"src": "/images/add.png",
					"ref": ""
				});

				let equipmentId = rowData.id;

				// 加载装备已镶嵌的宝石
				loadInlayBaoshi(equipmentId);

				// 加载装备镶嵌的器灵
				ajaxGet("/qiling/selectImage", {
					equipmentId: equipmentId
				}, function (resp) {
					let data = resp.data;

					if (data) {
						$("#qiling").attr({
							"src": data.image,
							"ref": data.id
						});
					}
				}, function () {
					$("#qiling").attr("src", "/images/add.png");
				});

				// 加载装备图片
				ajaxGet("/equipment_category/selectById", {
					id: rowData.categoryId
				}, function (resp) {
					let data = resp.data;

					$("#equipment").attr("src", data.image);
				}, error);
			}
		}
	});

	// 点击左边镶嵌宝石的（+）
	$("#baoshi_1").attr("src", "/images/add.png").click(function() {
		baoshi_location = 1;

		baoshiClick($(this), 392);
	});

	// 点击右边镶嵌宝石的（+）
	$("#baoshi_2").attr("src", "/images/add.png").click(function() {
		baoshi_location = 2;

		baoshiClick($(this), 800);
	});

	$("#equipment").on("click", function() {
		viewEquipment("#equipment_datalist");
	});

	// 点击下方（+）
	$("#qiling").attr("src", "/images/add.png").click(function() {
		let _this = this;

		qilingId = null;

		let rowData = $("#equipment_datalist").datagrid("getSelected");

		if (rowData) {
			qilingId = $("#qiling").attr("ref");

			if (qilingId) {
				$("#qiling_list").datalist("reload", {
					equipmentId: rowData.categoryId,
					roleId: rowData.roleId,
					callback: function () {
						qilingClick($(_this));
					}
				});
			} else {
				$("#qiling_list").datalist("reload", {
					equipmentId: rowData.categoryId,
					roleId: rowData.roleId
				});

				$("#qiling_dialog").dialog("open");
			}
		} else {
			alertMsg("请选择要镶嵌的装备！", "warning");
		}
	});

	$("#xiangqian_dialog").dialog({
		title: "镶嵌"
	});

	/******************************************************************************************************/

	/**
	 * 可镶嵌的宝石列表
	 */
	$("#baoshi_list").datalist({
		url: "/baoshi/selectList",
		idField: "id",
		width: 170,
		height: 280,
		textFormatter: function(value, rowData, rowIndex) {
			let content = "";

			content += "<table>";
			content += 	"<tr>";
			content += 		"<td rowspan='2'>";
			content += 			"<div class='baoshi'>";
			content += 				"<img src='" + rowData.image + "' />";
			content += 			"</div>";
			content += 		"</td>";

			content += 		"<td>";
			content +=				rowData.grade + "级" + rowData.name;
			content += 		"</td>";
			content += 	"</tr>";

			content += 	"<tr>";
			content += 		"<td>";
			content +=			"<span>" + rowData.propertyName + "</span>&ensp;";
			content +=		 	"+<span>" + (rowData.propertyValue * rowData.grade) + "</span>";
			content +=		 "</td>";
			content += 	"</tr>";
			content += "</table>";

			return content;
		},
		onSelect: function(rowIndex, rowData) {
			baoshiId = rowData.id;

			$("#baoshi_image").attr("src", rowData.image);
			$("#baoshi_grade").html(rowData.grade);
			$("#baoshi_name").html(rowData.name);
			$("#baoshi_property").html(rowData.propertyName);
			$("#baoshi_attribute").html(rowData.grade * rowData.propertyValue);
			$("#baoshi_note").html(rowData.note);

			$("#baoshi_inlay").linkbutton({
				text: operationArray[1 - rowData.inlayStatus]
			});

			$("#baoshi_detail").dialog("open");
		}
	});

	/**
	 * 可镶嵌的宝石
	 */
	$("#baoshi_dialog").dialog({
		title: "宝石",
		width: 184,
		height: 320
	});

	/******************************************************************************************************/

	/**
	 * 宝石详情对话框的【镶嵌】/【取下】按钮
	 */
	$("#baoshi_inlay").linkbutton({
		text: operationArray[1]
	}).click(function() {
		let equipment = $("#equipment_datalist").datalist("getSelected");

		if (equipment) {
			let equipmentId = equipment.id;
			ajaxGet("/baoshi/selectById", {
				id: baoshiId
			}, function (resp) {
				let baoshi = resp.data;

				ajaxPost("/baoshi/inlay", {
					location: baoshi_location,
					baoshiId: baoshiId,
					equipmentId: equipmentId,
					inlayStatus: baoshi.inlayStatus
				}, function (resp) {
					showMsg(resp.message);
					loadInlayBaoshi(equipmentId);

					$("#baoshi_detail").dialog("close");
					$("#baoshi_dialog").dialog("close");

					let roleId = equipment.roleId;

					$("#baoshi_list").datalist("reload", {
						roleId: roleId,
						equipmentId: equipmentId
					});
					$("#equipment_datalist").datalist("reload", {
						roleId: roleId
					});
				}, error);
			}, error);
		}
	});

	/**
	 * 宝石详情对话框
	 */
	$("#baoshi_detail").dialog({
		title: "宝石详情",
		width: 230
	});

	/******************************************************************************************************/

	$("#qiling_list").datalist({
		url: "/qiling/selectList",
		idField: "id",
		valueField: "id",
		textField: "id",
		width: 188,
		height: 261,
		textFormatter: function(value, rowData) {
			let content = "";

			content += "<table>";
			content += 	"<tbody>";
			content += 		"<tr>";
			content += 			"<td rowspan='2'>";
			content += 				"<div style='border:1px black solid;width:38px;height:38px;'>";
			content += 					"<img height='36' id='qiling_image_" + rowData.id + "' />";
			content += 				"</div>";
			content += 			"</td>";

			content += 			"<td>";
			content +=					"<span id='qiling_name_" + rowData.id + "'></span>";
			content += 			"</td>";
			content += 		"</tr>";

			content += 		"<tr>";
			content += 			"<td>";
			content +=					"<img width='16' id='qiling_taozhuang_image_" + rowData.id + "' />" + "<span id='qiling_taozhuang_name_" + rowData.id + "'></span>";
			content +=				"</td>";
			content += 		"</tr>";
			content += 	"</tbody>";
			content += "</table>";

			ajaxGet("/qiling_category/selectById", {
				id: rowData.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#qiling_image_" +  rowData.id).attr("src", data.image);
				$("#qiling_name_" +  rowData.id).html(data.name);
			}, error);

			if (rowData.taozhuangId !== 1) {
				ajaxGet("/qiling_taozhuang/selectById", {
					id: rowData.taozhuangId
				}, function(resp) {
					let data = resp.data;

					$("#qiling_taozhuang_image_" +  rowData.id).attr("src", data.image);
					$("#qiling_taozhuang_name_" +  rowData.id).html(data.name);
				}, error);
			}

			return content;
		},
		onSelect: function(rowIndex, rowData) {
			$("#qiling_taozhuang").hide();
			$("#qiling_taozhuang_name").empty();
			$("#qiling_taozhuang_xiaoguo").empty();

			$("#qiling_attribute").hide().empty();
			$("#qiling_forger").html(rowData.forger);
			$("#qiling_score").html(rowData.score);

			ajaxGet("/qiling_category/selectById", {
				id: rowData.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#qiling_image").attr("src", data.image);
				$("#qiling_name").html(data.name);

				if(rowData.taozhuangId !== 1) {
					$("#qiling_taozhuang").show();

					ajaxGet("/qiling_taozhuang/selectById", {
						id: rowData.taozhuangId
					}, function(resp) {
						let data = resp.data;

						$("#qiling_taozhuang_name").html(data.name);
						$("#qiling_taozhuang_xiaoguo").html(data.note);
					}, error);
				}

				$("#qiling_grade").html(data.grade);
				$("#qiling_note").html(data.note);

				// 器灵属性
				ajaxGet("/qiling_attribute/selectAttributes", {
					qilingId: rowData.id
				}, function(resp) {
					let data = resp.data;

					if (data.length > 0) {
						let html = "";

						for (let i = 0; i < data.length; i++) {
							let attribute = data[i];

							html += "<span>&emsp;" + attribute.propertyName + "&ensp;+"
								+ attribute.propertyValue + "</span>";

							if (i !== data.length) {
								html += "<br/>";
							}
						}

						$("#qiling_attribute").append(html).show();
					}
				}, error);

				$("#qiling_inlay").linkbutton({
					text: operationArray[1 - rowData.inlayStatus]
				});

				$("#qiling_detail").dialog("open");
			}, error);
		}
	});

	// 可镶嵌的器灵
	$("#qiling_dialog").dialog({
		title: "器灵",
		width: 202,
		height: 302
	});

	/******************************************************************************************************/

	// 器灵详情对话框中的【镶嵌】/【取下】按钮
	$("#qiling_inlay").linkbutton({
		text: "&emsp;镶&emsp;嵌&emsp;"
	}).click(function() {
		if(!qilingId) {
			let qiling = $("#qiling_list").datalist("getSelected");

			if (qiling) {
				qilingId = qiling.id;
			} else {
				alertMsg("请选择一件器灵！");
			}
		}

		let rowData = $("#equipment_datalist").datalist("getSelected");

		if (rowData) {
			let equipmentId = rowData.id;

			ajaxPost("/qiling/inlay", {
				qilingId: qilingId,
				equipmentId: equipmentId
			}, function (resp) {
				showMsg(resp.message);

				$("#qiling").attr("src", "/images/add.png");

				// 刷新器灵列表
				$("#qiling_list").datalist("reload", {
					roleId: rowData.roleId
				});

				// 刷新装备列表后选择对应的装备
				$("#equipment_datalist").datalist("reload", {
					roleId: rowData.roleId,
					callback: function () {
						$("#equipment_datalist").datalist("selectRecord", equipmentId);
					}
				});

				$("#qiling_detail").dialog("close");
				$("#qiling_dialog").dialog("close");
			}, error);
		}
	});

	// 器灵详情对话框
	$("#qiling_detail").dialog({
		title: "器灵详情",
		width: 230,
		modal: false
	});

	/******************************************************************************************************/

	/**
	 * 表格体的高度
	 * @type {number}
	 */
	let heigt_body = heigt_tr_with_role_details * 10;
	/**
	 * 表格高度
	 * @type {number}
	 */
	let height_table = heigt_tool + heigt_header + heigt_filter + heigt_body + heigt_footer + heigt_scoll_bar + 2;

	let datagrid = $("#equipment_list").datagrid({
		url: "/equipment/selectByPage",
		height: height_table,
		rownumbers: true,
		pagination: true,
		remoteFilter: true,
		clientPaging: false,
		onHeaderContextMenu: function(event) {
			event.preventDefault();

			if (!columnMenu){
				createColumnMenu("#equipment_list");
			}
			columnMenu.menu("show", {
				left: event.pageX,
				top: event.pageY
			});
		},
		onLoadSuccess: function () {
			let selector = "#equipment_list";
			let fields = getFields(selector);

			if (fields.length > 0) {
				let datagrid = $(selector);

				for (let i = 0; i < fields.length; i++) {
					let field = fields[i];

					// 隐藏未选中的字段
					if (!field.selected) {
						datagrid.datagrid("hideColumn", field.name);
					}
				}

				datagrid.datagrid("fitColumns");
			}
		},
		toolbar: [{
			iconCls: "icon-add",
			text: "添加",
			handler: function() {
				addHandler();
			}
		}, "-", {
			iconCls: "icon-edit",
			text: "修改",
			handler: function() {
				editHandler();
			}
		}, "-", {
			iconCls: "icon-shield",
			text: "属性",
			handler: function() {
				attributeHandler();
			}
		}, "-", {
			iconCls: "icon-baoshi",
			text: "镶嵌",
			handler: function() {
				inlayHandler();
			}
		}, "-", {
			iconCls: "icon-delete",
			text: "删除",
			handler: function() {
				deleteHandler();
			}
		}, "-", {
			iconCls: "icon-ok",
			text: "计算评分",
			handler: function() {
				computeHandler();
			}
		}, "-", {
			iconCls: "icon-search",
			text: "预览装备",
			handler: function() {
				viewHandler();
			}
		}],
		frozenColumns: [[
			{field: "ck", checkbox: true},
			{field: "id", hidden: true},
			{field: "categoryId", title: "装备类型", align: "center", width: 160
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/equipment_category/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$('#equipment_' + rowIndex).tooltip({
							position: "left",
							content: "<span class='white'>" + data.name + "：" + data.note + "</span>",
							onShow: function() {
								$(this).tooltip("tip").css({
									backgroundColor: "#666",
									borderColor: "#666"
								});
							}
						}).attr("src", data.image);
					}, error);

					return "<img height='" + size + "' id='equipment_" + rowIndex + "' />";
				}
			},
			roleDetailsColumn
		]],
		columns: [[
			{field: "texiaoId", title: "特效", align: "center", width: 160
				, formatter: function(value, rowData, rowIndex) {
					if(value) {
						ajaxGet("/equipment_texiao/selectById", {
							id: value
						}, function(resp) {
							let data = resp.data;

							$("#texiao_" + rowIndex).html(data.name);
						    $('#texiao_' + rowIndex).tooltip({
						        position: "bottom",
						        content: "<span class='white'>" + data.name + "：" + data.note + "</span>",
						        onShow: function() {
						    		$(this).tooltip("tip").css({
						    			backgroundColor: "#666",
						    			borderColor: "#666"
						    		});
						        }
						    });
						}, error);
						return "<div class='blue' id='texiao_" + rowIndex + "'></div>";
					}

					return "/";
				}
			},
			{field: "tejiId", title: "特技", align: "center", width: 160
				, formatter: function(value, rowData, rowIndex) {
					if(value) {
						ajaxGet("/equipment_teji/selectById", {
							id: value
						}, function(resp) {
							let data = resp.data;

							$("#teji_" + rowIndex).attr("src", data.image).attr("alt", data.name);
							$('#teji_' + rowIndex).tooltip({
						        position: "right",
						        content: "<span class='white'>" + data.name + "：" + data.note + "</span>",
						        onShow: function() {
						    		$(this).tooltip("tip").css({
						    			backgroundColor: "#666",
						    			borderColor: "#666"
						    		});
						        }
						    });
						}, error);
						
						return "<img height='" + size + "' id='teji_" + rowIndex + "' />";
					}

					return "/";
				}
			},
			{field: "forger", title: "打造者", align: "center", width: 160},
			{field: "durability", title: "耐久度", align: "center", width: 160, sortable: true},
			{field: "failTimes", title: "修理失败次数", align: "center", width: 160
				, formatter: function(value) {
					if (value > 0) {
						return "<span class='red'>" + value + "次</span>";
					} else {
						return "<span>/</span>";
					}
				}
			},
			{field: "score", title: "装备评分", align: "center", width: 160, sortable: true},
			{field: "wearStatus", title: "穿戴状态", align: "center", width: 160
				, formatter: function(value) {
					return "<span>" + wearStates[value] + "</span>";
				}
			},
			{field: "fulingStatus", title: "附灵状态", align: "center", width: 160
				, formatter: function(value) {
					return "<span>" + fulingStates[value] + "</span>";
				}
			}
		]]
	});

	datagrid.datagrid("enableFilter", [{
		field: "categoryId",
		type: "combobox",
		options: {
			url: "/equipment_category/selectAll",
			valueField: "id",
			textField: "name",
			panelHeight: "auto",
			formatter: function(row) {
				return "<img width='20' src='" + row.image + "' />&nbsp;" + row.name;
			}
		},
		operator: ["equal"]
	}, {
		field: "texiaoId",
		type: "combobox",
		options: {
			url: "/equipment_texiao/selectAll",
			valueField: "id",
			textField: "name",
			panelHeight: "auto"
		},
		operator: ["equal", "notequal"]
	}, {
		field: "tejiId",
		type: "combobox",
		options: {
			url: "/equipment_teji/selectAll",
			valueField: "id",
			textField: "name",
			panelHeight: "auto",
			formatter: function(row) {
				return "<img width='20' src='" + row.image + "' />&nbsp;" + row.name;
			}
		},
		operator: ["equal", "notequal"]
	}, {
		field: "wearStatus",
		type: "combobox",
		options: {
			panelHeight: "auto",
			data: getJsonData(wearStates)
		},
		operator: ["equal"]
	}, {
		field: "score",
		type: "numberspinner",
		operator: ["equal", "less", "lessorequal", "greater", "greaterorequal"],
		options: {
			min: 1
		}
	}, {
		field: "roleId",
		type: "combobox",
		options: {
			url: "/role_account/selectAll",
			valueField: "id",
			textField: "name",
			panelHeight: "auto",
			formatter: function(row) {
				ajaxGet("/role_category/selectById", {
					id: row.categoryId
				}, function(resp) {
					let data = resp.data;

					$("#_modeling_" + row.id).attr({
						"src": data.image,
						"title": data.name
					});
				}, error);

				return "<img width='20' id='_modeling_" + row.id + "' />&ensp;" + row.name;
			}
		},
		operator: ["equal"]
	}]);

});